<template>
    <div id="quitClassContainer">
        <div id="headTitle">退出班级</div>
        <div id="table">
            <el-table max-height="700" :data="userClassInfo" border>
                <el-table-column type="selection" width="40" align="center"/>
                <el-table-column id="classID" prop="classID" label="班级ID" show-overflow-tooltip align="center"/>
                <el-table-column id="className" prop="className" label="班级" show-overflow-tooltip align="center"/>
                <el-table-column label="操作" width="150" align="center">
                    <template #default="scope">
                        <el-button type="primary" plain @click="quitClass(scope.row.classID,scope.row.className)">退出班级</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
//css
import "../assets/QuitClass.css";
//请求
import request from '@/utils/requset.js';
//顶部提示信息
import prompt from '@/utils/prompt.js'
//路由跳转
import router from "@/router";
import {reactive, ref} from "vue";

export default {
    name: 'classInfo',
    data() {
        return {
            userClassInfo: [],
            quitClassData: {}
        }
    },
    created() {
        if (this.isIntoClass() && !this.isClassAdmin()) {
            this.loadClassData();
        }
    },
    methods: {
        isIntoClass(){
            let classID = localStorage.getItem("userInfo") ? JSON.parse(localStorage.getItem("userInfo")).classID : 0;
            if (classID < 1) {
                prompt("还未加入班级，无需退出！","error");
                router.push({path: "home"});
                return false;
            }
            return true;
        },
        isClassAdmin(){
            let isClassAdmin = localStorage.getItem("userInfo") ? JSON.parse(localStorage.getItem("userInfo")).isClassAdmin : "";
            if (isClassAdmin === "是") {
                prompt("班级管理员无法直接退出班级！","error");
                router.push({path: "home"});
                return true;
            }
            return false;
        },
        loadClassData() {
            let token = localStorage.getItem("token") ? localStorage.getItem("token") : "";
            if (token === "") {
                prompt("还未登录！", "error");
                router.push({path: "/login"});
                return;
            }
            request.get("/user/classInfo", {
                params: {
                    token: token
                }
            }).then(result => {
                //请求失败
                if (result.code !== "200") {
                    prompt(result.message, result.type);
                }
                //请求成功
                this.userClassInfo = result.data.userClassInfo;
            })
        },
        //退出班级
        quitClass(classID, className){
            this.quitClassData.classID = classID;
            this.quitClassData.userToken = localStorage.getItem("token") ? localStorage.getItem("token") : "";
            request.post(
                "/class/quit",
                this.quitClassData
            ).then(result => {
                if (result.code != "200"){
                    prompt("退出" + className + "失败", result.type);
                }
                prompt("成功退出" + className, result.type);
                router.push({path: "home"});
                return;
            });
        },
    }
}
</script>